import { defineConfig, loadEnv } from 'vite'
import react from '@vitejs/plugin-react'
import viteCompression from 'vite-plugin-compression'

// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
  // 加载环境变量
  const env = loadEnv(mode, process.cwd());
  
  console.log(`Building in ${mode} mode. App mode: ${env.VITE_APP_MODE}`);
  
  return {
    plugins: [
      react(),
      viteCompression({
        verbose: true, // 是否在控制台输出压缩结果
        disable: false, // 是否禁用压缩
        threshold: 10240, // 体积大于阈值会被压缩，单位为 b，默认为 10240 (10kb)
        algorithm: 'gzip', // 压缩算法
        ext: '.gz', // 生成的压缩包后缀
        deleteOriginFile: false, // 是否删除原文件
      })
    ],
    // 定义环境变量
    define: {
      'process.env': env
    },
    build: {
      // 优化打包配置
      minify: 'terser', // 使用 terser 进行更强的压缩
      terserOptions: {
        compress: {
          drop_console: mode === 'production', // 只在生产环境删除console
          drop_debugger: mode === 'production' // 只在生产环境删除debugger
        }
      },
      // chunk 分割策略
      rollupOptions: {
        output: {
          chunkFileNames: 'assets/js/[name]-[hash].js',
          entryFileNames: 'assets/js/[name]-[hash].js',
          assetFileNames: 'assets/[ext]/[name]-[hash].[ext]',
          // 将大型依赖包拆分成单独的 chunks
          manualChunks(id) {
            if (id.includes('node_modules')) {
              // 返回 node_modules 里的包名称作为 chunk 的名称
              const packageName = id.toString().split('node_modules/')[1].split('/')[0]
              return `vendor-${packageName}`
            }
          }
        }
      },
      // 启用 CSS 代码分割
      cssCodeSplit: true,
      // 构建后的文件大小报告
      reportCompressedSize: true,
      // 块大小警告的限制 (kb)
      chunkSizeWarningLimit: 1000,
    }
  }
})
